<template>
  权限管理<br>
  用户编号：{{ userObj.id }} 用户名：{{ userObj.name }}
  <div style="display: flex">
    <div v-for="grade in gradeList" :key="grade.id">
      <input type="checkbox" :value="grade.id" v-model="gradeIdArray"/>
      {{ grade.name }}
    </div>
  </div>
  {{ gradeIdArray }}

</template>

<script>
export default {
  data() {
    return {
      gradeIdArray: [],
      gradeList: [
        {id: 1, name: "用户管理"},
        {id: 2, name: "商品管理"},
        {id: 3, name: "权限管理"},
        {id: 4, name: "角色管理"},
        {id: 5, name: "系统管理"},
        {id: 6, name: "统计信息"}
      ],
      userObj: {
        id: 1,
        name: "coco",
        userGradeList: [
          {id: 3, name: "权限管理"},
          {id: 6, name: "统计信息"}
        ]
      }
    }
  },
  created() {
    this.gradeIdArray = this.userObj.userGradeList.map(n => n.id)
  }
}
</script>

<style scoped>

</style>